<template>
  <h1>隐藏显示指令</h1>
  <p v-if="true">张三</p>
  <p v-if="false">李四</p><!--该元素不会被渲染到DOM中，直接跳过-->
  <hr>
  <p v-show="true">小红</p>
  <p v-show="false">小绿</p><!--display:none-->
  <hr>
  <p v-if="is_show">太阳</p>
  <p v-else>月亮</p><!--找离自己最近的v-if取反-->
</template>
<script setup>
import {ref} from "vue";

const is_show = ref(true)
</script>


<style scoped>

</style>